<!-- 添加原料基础数据 -->
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>添加原料基础数据</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="stylesheet" href="/lib/layui-v2.6.8/css/layui.css" media="all" />
    <link rel="stylesheet" href="/css/public.css" media="all" />
    <style>
        body {
            background-color: #ffffff;
        }

        .layui-elem-quote {
            padding: 10px;
            border-left: 5px solid #009688;
        }

        fieldset legend {
            margin-bottom: 16px;
        }

        .layui-input-block {
            margin-right: 15px;
        }
    </style>
</head>

<body>
    <blockquote class="layui-elem-quote layui-text">从这里添加原材料的基础数据，包括颜色样式数据和规格型号数据。请先保存原材料基础数据再添加颜色样式数据和规格型号数据。</blockquote>
    <fieldset class="layui-elem-field">
        <legend>原材料基础数据</legend>
        <div class="layui-form layuimini-form" lay-filter="addForm">
            <!-- 要修改的主键ID -->
            <input type="hidden" id="id" name="id" value="" />
            <!-- 表单字段 -->
            <div class="layui-form-item">
                <label class="layui-form-label required">所属类别</label>
                <div class="layui-input-inline">
                    <select id="categoryId" name="categoryId" lay-verify="required" lay-search lay-filter="categoryId">
                        <option value="">请选择</option>
                    </select>
                </div>
                <div class="layui-form-mid layui-word-aux">选择原材料所属的类别</div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">原材料名称</label>
                <div class="layui-input-block">
                    <input type="text" id="name" name="name" lay-verify="required|name" lay-reqtext="原料名称不能为空" placeholder="请输入" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">单位</label>
                <div class="layui-input-block">
                    <input type="text" id="unit" name="unit" lay-verify="required" lay-reqtext="单位不能为空" placeholder="请输入" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">默认成本</label>
                <div class="layui-input-block">
                    <input type="text" id="defaultCost" name="defaultCost" lay-verify="required|number" lay-reqtext="默认成本不能为空" placeholder="请输入" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">加工成本</label>
                <div class="layui-input-block">
                    <input type="text" id="machineCost" name="machineCost" lay-verify="required|number" lay-reqtext="加工成本不能为空" placeholder="请输入" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">系数</label>
                <div class="layui-input-block">
                    <input type="text" id="coefficient" name="coefficient" lay-verify="required|number" lay-reqtext="系数 用于价格计算不能为空" placeholder="请输入" value="" class="layui-input" />
                    <tip>用于价格计算</tip>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">预警数量</label>
                <div class="layui-input-block">
                    <input type="text" id="warnThreshold" name="warnThreshold" lay-verify="required|number" lay-reqtext="预警数量不能为空" placeholder="请输入" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <textarea id="remark" name="remark" placeholder="请输入" value="" class="layui-textarea"></textarea>
                </div>
            </div>

            <!-- 确认保存按钮 -->
            <div class="layui-form-item">
                <div class="layui-input-block" style="text-align: right;">
                    <button class="layui-btn layui-btn-primary layui-layer-close1" id="cancel">取消</button>
                    <button class="layui-btn" lay-submit lay-filter="saveBtn" id="submit"><i class="layui-icon"></i>确认保存</button>
                </div>
            </div>
        </div>
    </fieldset>

    <!-- Tab页展示条目列表 -->
    <div class="layui-tab layui-tab-brief">
        <ul class="layui-tab-title">
            <li class="layui-this">颜色样式</li>
            <li>规格型号</li>
        </ul>
        <div class="layui-tab-content">
            <!-- 第1个Tab页 layui-show表示显示 -->
            <div class="layui-tab-item layui-show">
                <!-- 公共操作栏 -->
                <script type="text/html" id="toolbarGlobal1">
                    <div class="layui-btn-container">
                        <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="add">
                            <i class="layui-icon"></i>
                            添加
                        </button>
                        <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete">
                            <i class="layui-icon"></i>
                            删除
                        </button>
                    </div>
                </script>
                <!-- 表格数据显示 -->
                <table class="layui-hide" id="currentTable1" lay-filter="currentTableFilter1"></table>
                <!-- 表格中的操作栏 -->
                <script type="text/html" id="currentTableBar1">
                    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">
                        <i class="layui-icon"></i>
                        编辑
                    </a>
                    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">
                        <i class="layui-icon"></i>
                        删除
                    </a>
                </script>
            </div>
            <!-- 第2个Tab页 -->
            <div class="layui-tab-item">
                <!-- 公共操作栏 -->
                <script type="text/html" id="toolbarGlobal2">
                    <div class="layui-btn-container">
                        <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="add">
                            <i class="layui-icon"></i>
                            添加
                        </button>
                        <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete">
                            <i class="layui-icon"></i>
                            删除
                        </button>
                    </div>
                </script>
                <!-- 表格数据显示 -->
                <table class="layui-hide" id="currentTable2" lay-filter="currentTableFilter2"></table>
                <!-- 表格中的操作栏 -->
                <script type="text/html" id="currentTableBar2">
                    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">
                        <i class="layui-icon"></i>
                        编辑
                    </a>
                    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">
                        <i class="layui-icon"></i>
                        删除
                    </a>
                </script>
            </div>
        </div>
    </div>

    <!-- 后端接口定义 -->
    <script src="/js/api-route.js"></script>
    <!-- 页面事件处理 -->
    <script src="/lib/layui-v2.6.8/layui.js" charset="utf-8"></script>
    <!-- 引入模块配置 -->
    <script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
    <script>
        layui.use(['jquery', 'layer', 'form', 'table'], function () {
            var $ = layui.jquery,
                layer = layui.layer,
                form = layui.form,
                table = layui.table;

            // 新增数据ID
            var p_id = 0;

            // 绑定下拉列表数据
            $.ajax({
                url: $api.basecategory.list, // 请求地址
                type: 'GET',
                data: {
                    parentId: 1
                }, // 请求参数
                dataType: 'JSON',
                async: false, // 使用同步请求
                contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                success: function (res) {
                    // 循环给下拉列表赋值
                    $.each(res.data, function (index, value) {
                        $('select[name=categoryId]').append(new Option(value.category, value.id)); // 向下拉列表添加元素（显示内容，实际值）
                    });
                    form.render(); // 重新渲染下拉列表
                }
            })

            // 监听下拉列表值改变
            form.on('select(categoryId)', function (data) {
                var value = data.value; // 得到选中的值
                var text = $(this)[0].innerText; // 得到选中的文本
                console.log(value + " - " + text);
            });

            // 表单初始化赋值，如果表单初始化加载不成功，添加如下代码：form.render();
            form.val('addForm', {
                'defaultCost': '6', // 默认成本
                'machineCost': '0', // 加工成本
                'coefficient': '1.2', // 系数
                'warnThreshold': '100', // 预警数量
            });

            // lay-verify设置验证规则，多个用"|"分割，默认规则有：required(必填项) phone(手机号) email(邮箱) url(网址) number(数字) date(日期) identity(身份证)
            // 自定义验证规则，例如：lay-verify="required|name"
            form.verify({
                // 验证名称是否重复
                name: function (value) {
                    var message = ''; // 验证结果
                    var params = {
                        name: value
                    };
                    // Ajax提交数据到后台
                    $.ajax({
                        url: $api.basematerial.list,
                        type: 'GET',
                        data: params, // 将对象转换为JSON字符串传递
                        dataType: 'JSON',
                        async: false, // 使用同步请求
                        contentType: 'application/json', // 指定请求方式为JSON
                        // headers: {
                        //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                        // },
                        success: function (res) {
                            if (res.code == 0) {
                                // 返回的数据行大于等于1表示已经存在
                                if (res.count >= 1 && res.data[0].id != p_id) {
                                    message = '该原材料名称已经添加过了';
                                }
                            }
                        },
                    });
                    // 验证结果返回需要写在Ajax方法外
                    if (message !== '') {
                        return message;
                    }
                },
                // 基本验证案例
                // name: function (value) {
                //     if (value.length >= 5) {
                //         return '姓名也太长了吧';
                //     }
                // },
                // 正则验证案例
                // mobile: [/^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/, '手机号码格式不正确'],
                // email: [/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, '电子邮件格式不正确'],
            });

            // 监听提交
            form.on('submit(saveBtn)', function (data) {
                // Ajax提交数据到后台
                $.ajax({
                    url: $api.basematerial.save,
                    type: 'POST',
                    data: JSON.stringify(data.field), // 将对象转换为JSON字符串传递
                    dataType: 'JSON',
                    contentType: 'application/json', // 指定请求方式为JSON
                    // headers: {
                    //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                    // },
                    success: function (res) {
                        if (res.code == 0) {
                            // 添加数据成功，将ID保存
                            p_id = res.data.id; // 将新增后返回对象的ID保存在p_id变量，用于传递到添加详情页面
                            $('#id').val(res.data.id); // 添加后保存ID，以便后续更新数据

                            layer.msg('数据已保存', {
                                icon: 6
                            });
                            parent.layui.table.reload('currentTable', {
                                page: {
                                    curr: 1
                                }
                            });
                        } else {
                            layer.msg('保存失败', {
                                icon: 5
                            });
                        }
                    },
                    error: function (res) {
                        layer.msg('服务器开小差了', {
                            offset: '15px',
                            icon: 2,
                            time: 1500,
                        });
                    }
                });
            });

            // 点击取消按钮
            $('#cancel').click(function () {
                // 关闭当前弹出页面
                window.parent.layer.closeAll();
                return false;
            });

            /* **************** 原材料颜色样式基础数据 **************** */

            // 表格1数据绑定
            table.render({
                elem: '#currentTable1', // 绑定到元素
                url: $api.basematerialcolour.pagelist, // 后端分页查询接口地址
                // contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                where: {
                    type: p_id // 将新添加的主ID作为条件关联查询
                }, // 查询的条件（可用Q请求参数类进行封装）
                request: {
                    // 处理接口中分页参数名称
                    pageName: 'pageNo', // 修改默认的分页参数，指定第几页参数pageName的名称
                    limitName: 'pageSize', // 修改默认的分页参数，指定每页多少数据参数limitName的名称
                },
                toolbar: '#toolbarGlobal1', // 表格上面的公共工具栏
                defaultToolbar: ['filter', 'exports', 'print'], // 默认的工具栏
                cols: [
                    [ // 绑定字段
                        {
                            type: 'checkbox', // 批量选择复选框
                            width: 50, // 自定义宽度
                        },
                        {
                            type: 'numbers', // 自增序号列
                            width: 80, // 自定义宽度
                            title: '序号', // 表头标题
                        },
                        {
                            field: 'colour',
                            title: '颜色样式',
                            edit: 'text',
                            align: 'center',
                        },
                        {
                            title: '操作',
                            width: 180,
                            toolbar: '#currentTableBar1',
                            align: 'center',
                        },
                    ],
                ],
                done: function (res, curr, count) {
                    form.render(); // 刷新表格分页显示数据
                },
                limits: [10, 20, 50, 120],
                limit: 10,
                page: false,
                skin: 'line',
            });

            /**
             * 表格编辑 edit是固定事件名，currentTableFilter是table原始容器的属性lay-filter对应的值
             */
            table.on('edit(currentTableFilter1)', function (obj) {
                // console.log(layui.table.cache["currentTable"]); // 整个表格的所有数据
                // console.log(obj.value); // 得到修改后的值
                // console.log(obj.field); // 当前编辑的字段名
                // console.log(obj.data); // 所在行的所有相关数据

                // 验证输入内容的合法性
                var old_value = $(obj.tr.find('[data-field=' + obj.field + ']')).text(); // 获取修改前字段对应的值
                if (obj.field == 'colour') { // 验证字段
                    if (obj.value.length == 0) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            val: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('值不能为空', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                    var verified = false; // 验证结果
                    var params = {
                        materialId: p_id, // 关联的原材料ID
                        colour: obj.value // 颜色值
                    };
                    // Ajax验证
                    $.ajax({
                        url: $api.basematerialcolour.list,
                        type: 'GET',
                        data: params, // 将对象转换为JSON字符串传递
                        dataType: 'JSON',
                        async: false, // 使用同步请求
                        contentType: 'application/json', // 指定请求方式为JSON
                        // headers: {
                        //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                        // },
                        success: function (res) {
                            if (res.code == 0) {
                                // 返回的数据行大于等于1表示已经存在
                                if (res.count >= 1 && res.data[0].id != obj.data.id) {
                                    verified = true; // 验证结果（true表示验证不通过）
                                }
                            }
                        },
                    });
                    // 验证不通过（true表示验证不通过）
                    if (verified) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            val: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('该颜色样式值已经添加过了', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                }

                // Ajax提交数据到后台
                $.ajax({
                    url: $api.basematerialcolour.update,
                    type: 'POST',
                    data: JSON.stringify(obj.data), // 将对象转换为JSON字符串传递
                    dataType: 'JSON',
                    contentType: 'application/json', // 指定请求方式为JSON
                    // headers: {
                    //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                    // },
                    success: function (res) {
                        if (res.code == 0) {
                            layer.msg('数据已更新', {
                                icon: 1,
                                time: 1000,
                            });
                        } else {
                            layer.msg('数据更新失败', {
                                icon: 2,
                                time: 1500,
                            });
                        }
                    },
                    error: function (res) {
                        layer.msg('数据更新失败', {
                            icon: 2,
                            time: 1500,
                        });
                    }
                });
            });

            /**
             * 弹出层[添加][删除]等监听事件
             */
            table.on('toolbar(currentTableFilter1)', function (obj) {
                // 如果没有保存主数据则不允许点击添加或删除按钮
                if (p_id == 0) {
                    layer.msg('请先保存原材料基础数据', {
                        icon: 5,
                        time: 1500,
                    });
                    return false;
                }
                if (obj.event === 'add') {
                    // 监听添加操作，与lay-event="add"对应
                    var index = layer.open({
                        id: 'addPage1', // 定义ID防止重复弹出
                        title: '添加原材料颜色样式', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/base_material_colour/add.html?pid=' + p_id, // 打开的页面
                    });
                } else if (obj.event === 'delete') {
                    // 监听批量删除操作，与lay-event="delete"对应
                    var checkStatus = table.checkStatus('currentTable1');
                    var data = checkStatus.data;
                    var ids = []; // 需要删除的ID数组
                    for (let i = 0; i < data.length; i++) {
                        ids[i] = data[i].id;
                    }
                    if (ids.length == 0) {
                        return false; // 未选中任何行
                    } // Ajax调用后端接口批量删除数据 
                    layer.confirm('真的批量删除么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.basematerialcolour.remove, // 后端批量删除接口地址 
                            type: 'POST',
                            data: JSON.stringify(ids), // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            contentType: 'application/json', // 指定请求方式为JSON 
                            // headers: {
                            //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token） 
                            // },
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            }
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable1', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.basematerialcolour.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });

            // 点击编辑按钮
            table.on('tool(currentTableFilter1)', function (obj) {
                var data = obj.data;
                if (obj.event === 'edit') {
                    var index = layer.open({
                        id: 'editPage1', // 定义ID防止重复弹出
                        title: '编辑原材料颜色样式', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/base_material_colour/edit.html?id=' + data.id, // 打开的页面
                        // success: function (layero, index) {
                        //     // 加载动画
                        //     layer.load(2, {
                        //         time: 10, // 持续时间10毫秒
                        //         shade: false,
                        //     });
                        // }
                    });
                    // 当调整浏览器窗口大小时重新设置全屏
                    // $(window).on('resize', function () {
                    //     layer.full(index); // 全屏显示
                    // });
                    // layer.full(index); // 默认全屏显示
                    return false;
                } else if (obj.event === 'delete') {
                    layer.confirm('真的删除行么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.basematerialcolour.delete, // 后端删除接口地址 
                            type: 'POST',
                            data: 'id=' + data.id, // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            },
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable1', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.basematerialcolour.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });

            /* **************** 原材料规格型号基础数据 **************** */

            // 表格2数据绑定
            table.render({
                elem: '#currentTable2', // 绑定到元素
                url: $api.basematerialmodel.pagelist, // 后端分页查询接口地址
                // contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                where: {
                    type: p_id // 将新添加的主ID作为条件关联查询
                }, // 查询的条件（可用Q请求参数类进行封装）
                request: {
                    // 处理接口中分页参数名称
                    pageName: 'pageNo', // 修改默认的分页参数，指定第几页参数pageName的名称
                    limitName: 'pageSize', // 修改默认的分页参数，指定每页多少数据参数limitName的名称
                },
                toolbar: '#toolbarGlobal2', // 表格上面的公共工具栏
                defaultToolbar: ['filter', 'exports', 'print'], // 默认的工具栏
                cols: [
                    [ // 绑定字段
                        {
                            type: 'checkbox', // 批量选择复选框
                            width: 50, // 自定义宽度
                        },
                        {
                            type: 'numbers', // 自增序号列
                            width: 80, // 自定义宽度
                            title: '序号', // 表头标题
                        },
                        {
                            field: 'model',
                            title: '规格型号',
                            edit: 'text',
                            align: 'center',
                        },
                        {
                            title: '操作',
                            width: 180,
                            toolbar: '#currentTableBar2',
                            align: 'center',
                        },
                    ],
                ],
                done: function (res, curr, count) {
                    form.render(); // 刷新表格分页显示数据
                },
                limits: [10, 20, 50, 120],
                limit: 10,
                page: false,
                skin: 'line',
            });

            /**
             * 表格编辑 edit是固定事件名，currentTableFilter是table原始容器的属性lay-filter对应的值
             */
            table.on('edit(currentTableFilter2)', function (obj) {
                // console.log(layui.table.cache["currentTable"]); // 整个表格的所有数据
                // console.log(obj.value); // 得到修改后的值
                // console.log(obj.field); // 当前编辑的字段名
                // console.log(obj.data); // 所在行的所有相关数据

                // 验证输入内容的合法性
                var old_value = $(obj.tr.find('[data-field=' + obj.field + ']')).text(); // 获取修改前字段对应的值
                if (obj.field == 'model') { // 验证字段
                    if (obj.value.length == 0) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            val: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('值不能为空', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                    var verified = false; // 验证结果
                    var params = {
                        materialId: p_id, // 关联的原材料ID
                        model: obj.value // 颜色值
                    };
                    // Ajax验证
                    $.ajax({
                        url: $api.basematerialmodel.list,
                        type: 'GET',
                        data: params, // 将对象转换为JSON字符串传递
                        dataType: 'JSON',
                        async: false, // 使用同步请求
                        contentType: 'application/json', // 指定请求方式为JSON
                        // headers: {
                        //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                        // },
                        success: function (res) {
                            if (res.code == 0) {
                                // 返回的数据行大于等于1表示已经存在
                                if (res.count >= 1 && res.data[0].id != obj.data.id) {
                                    verified = true; // 验证结果（true表示验证不通过）
                                }
                            }
                        },
                    });
                    // 验证不通过（true表示验证不通过）
                    if (verified) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            val: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('该规格型号值已经添加过了', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                }

                // Ajax提交数据到后台
                $.ajax({
                    url: $api.basematerialmodel.update,
                    type: 'POST',
                    data: JSON.stringify(obj.data), // 将对象转换为JSON字符串传递
                    dataType: 'JSON',
                    contentType: 'application/json', // 指定请求方式为JSON
                    // headers: {
                    //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                    // },
                    success: function (res) {
                        if (res.code == 0) {
                            layer.msg('数据已更新', {
                                icon: 1,
                                time: 1000,
                            });
                        } else {
                            layer.msg('数据更新失败', {
                                icon: 2,
                                time: 1500,
                            });
                        }
                    },
                    error: function (res) {
                        layer.msg('数据更新失败', {
                            icon: 2,
                            time: 1500,
                        });
                    }
                });
            });

            /**
             * 弹出层[添加][删除]等监听事件
             */
            table.on('toolbar(currentTableFilter2)', function (obj) {
                // 如果没有保存主数据则不允许点击添加或删除按钮
                if (p_id == 0) {
                    layer.msg('请先保存原材料基础数据', {
                        icon: 5,
                        time: 1500,
                    });
                    return false;
                }
                if (obj.event === 'add') {
                    // 监听添加操作，与lay-event="add"对应
                    var index = layer.open({
                        id: 'addPage2', // 定义ID防止重复弹出
                        title: '添加原材料规格型号', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/base_material_model/add.html?pid=' + p_id, // 打开的页面
                    });
                } else if (obj.event === 'delete') {
                    // 监听批量删除操作，与lay-event="delete"对应
                    var checkStatus = table.checkStatus('currentTable2');
                    var data = checkStatus.data;
                    var ids = []; // 需要删除的ID数组
                    for (let i = 0; i < data.length; i++) {
                        ids[i] = data[i].id;
                    }
                    if (ids.length == 0) {
                        return false; // 未选中任何行
                    } // Ajax调用后端接口批量删除数据 
                    layer.confirm('真的批量删除么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.basematerialmodel.remove, // 后端批量删除接口地址
                            type: 'POST',
                            data: JSON.stringify(ids), // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            contentType: 'application/json', // 指定请求方式为JSON 
                            // headers: {
                            //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token） 
                            // },
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            }
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable2', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.basematerialmodel.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });

            // 点击编辑按钮
            table.on('tool(currentTableFilter2)', function (obj) {
                var data = obj.data;
                if (obj.event === 'edit') {
                    var index = layer.open({
                        id: 'editPage2', // 定义ID防止重复弹出
                        title: '编辑原材料规格型号', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/base_material_model/edit.html?id=' + data.id, // 打开的页面
                        // success: function (layero, index) {
                        //     // 加载动画
                        //     layer.load(2, {
                        //         time: 10, // 持续时间10毫秒
                        //         shade: false,
                        //     });
                        // }
                    });
                    // 当调整浏览器窗口大小时重新设置全屏
                    // $(window).on('resize', function () {
                    //     layer.full(index); // 全屏显示
                    // });
                    // layer.full(index); // 默认全屏显示
                    return false;
                } else if (obj.event === 'delete') {
                    layer.confirm('真的删除行么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.basematerialmodel.delete, // 后端删除接口地址
                            type: 'POST',
                            data: 'id=' + data.id, // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            },
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable2', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.basematerialmodel.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });
        });
    </script>
</body>

</html>